@extends('Admin.base')
@section('css')
    <link rel="stylesheet" href="/Admin/layuiadmin/css/extend/formSelects-v4.css" media="all">
@endsection
@section('content')

    <div class="layui-card">
        <div class="layui-form layui-card-header layuiadmin-card-header-auto ">
            <div class="layui-form-item layui-row">
                <div class="layui-inline layui-col-md5">
                    <label class="layui-form-label">关键词</label>
                    <div class="layui-input-block">
                        <input type="text" name="keyword" placeholder="订单号、收货人姓名、手机号码、快递单号" autocomplete="off" class="layui-input">
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">下单日期:</label>
                    <div class="layui-input-block">
                        <input type="text" name="time"  autocomplete="off" class="layui-input" id="time-range" >
                    </div>
                </div>
                <div class="layui-inline">
                    <label class="layui-form-label">邮寄状态</label>
                    <div class="layui-input-block">
                        <select name="status">
                            <option value=''>全部类型</option>
                            @foreach (\App\Models\Order::POST_STATUS as $status => $name)
                                <option value="{{$status ?? 0}}">{{$name ?? ''}}</option>
                            @endforeach
                        </select>
                    </div>
                </div>

                <div class="layui-inline">
                    <div class="layui-btn-group layui-input-block">
                        <button class="layui-btn layui-btn-sm layui-input-block layuiadmin-btn-admin" lay-submit lay-filter="LAY-search">
                            <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
        <div class="layui-card-body">
            <table id="LAY-table" lay-filter="LAY-table"></table><span id="msg">总计: {{$msg}}元</span>
            <script type="text/html" id="toolbar">
                <a href="{{url('admin/post/')}}/@{{ d.id }}/detail" class="layui-btn layui-btn-green layui-btn-xs">
                    详情
                </a>
            </script>
        </div>

            @endsection
            @section('script')
                <script src="/js/ajax.js"></script>
                <script>
                    layui.use(['form', 'table','laydate'], function(){
                        var $ = layui.$
                                ,form = layui.form
                                ,table = layui.table
                                ,laydate = layui.laydate
                        laydate.render({
                            elem: '#time-range'
                            ,type: 'date'
                            ,range: true
                        });

                        table.render({
                            elem: '#LAY-table'
                            ,url: "/admin/post/table"
                            ,method: "post"
                            ,page: true
                            ,limit:10
                            ,cols: [[
                                 {field: 'user_name', title: '收货人姓名'}
                                ,{field: '', title: '商品名称',width:500,templet:function(d){
                                        for(var i in d.order_goods){
                                            var goods = d.order_goods[i]['goods_name'];
                                            var photo = d.order_goods[i]['photo'];
                                            var amount = d.order_goods[i]['amount'];
                                            html = '<img src="'+ photo +'" width="20px" height="20px" >'+ goods +' ✖️ '+ amount +' <br> ';
                                            return html;
                                        }
                                    }}
                                ,{field: 'total_weight', title: '总质量'}
                                ,{field: 'online_order', title: '订单编号'}
                                ,{field: 'post_status', title: '邮寄状态'}
                                ,{field: 'postage', title: '邮寄费用'}
                                ,{field: 'express_order', title: '快递单号'}
                                ,{field: 'express_name', title: '快递名称'}
                                ,{title: '操作', align: 'center', toolbar: '#toolbar'}
                            ]]
                        });

                        //监听工具条
                        table.on('tool(LAY-table)', function(obj){
                            var data = obj.data;
                            if(obj.event === 'export'){

                            }
                        });
                        //监听搜索
                        form.on('submit(LAY-search)', function(data){
                            var field = data.field;
                            //执行重载
                            table.reload('LAY-table', {
                                where: field,page: {curr: 1}
                            });
                            $.ajax({
                                url: '/admin/post/table'
                                , type: 'POST'
                                , dataType: 'json'
                                , data: field
                                , success: function (ret) {
                                    $("#msg").html("总计: "+ret.msg+"元");
                                }

                            });
                        });
                    });


                </script>

@endsection